
<div class="container-fluid" id="topN" >

    <div class="container">

        <div class="row">
            <div class="col-md-12">
                <p style="background-color: cornflowerblue ; color: white; font-size: 30px">图书销售排行榜</p>
            </div>
        </div>

        <div class="row">
            <div class="col-sm-6 col-md-4" v-for="(book,index) in topNBooks" >
                <div class="thumbnail">
                    <img :src="book.imgsrc" alt="..." class="col-sm-6 col-md-6" style="width: 140px;height: 130px">
                    <div class="caption text-left">
                        <p>排名:<span v-text="index+1"></span></p>
                        <p>书名:<span v-text="book.name"></span></p>
                        <p>价格:<span v-text="book.price"></span></p>
                        <p>
                            <a class="btn btn-primary" @click.prevent="seeBookDetailOf(book.id)">详情</a> &nbsp;&nbsp;&nbsp;&nbsp;
                            <a class="btn btn-success" >加入购物车</a>
                        </p>
                    </div>
                </div>
            </div>
        </div>

    </div>


</div>
